<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE HTML>
<html>
<head>
<title>Client</title>
<%@include file="/WEB-INF/css.jsp" %>
<%@include file="/WEB-INF/javascript.jsp" %>
<style>
</style>
<script>
$(document).ready(function(){
	$('#ClientFiltersContainer').buttonset().change(function(){
		$('#ClientsContainer').empty();
		// Collect all filters, get clients by filters.
		var filters={};
		$('#ClientFiltersContainer :checked').each(function(){
			filters[$(this).attr('name')]=true;
		});
		$.ajax({
			url:"/AjaxGetAllClients",
			type:"GET",
			dataType:"json",
			data:filters,
			success:function(data,status,xhr){
				var clients=data.data;
				var clientsContainer=$('#ClientsContainer');
				for(var i=0;i<clients.length;i++){
					clientsContainer.append('<div id="'+clients[i].clientId+'" class="BusinessClientCard">'+
					'<div class="ClientCardInfo"><span class="kheader" style="font-size:1.3em">Client No.: <a href="/GetClient?clientId='+clients[i].clientId+'">'+clients[i].ClientNumber+'</span></a><br/>'+
					'<span class="kheader">Legal Name:</span> <a href="/GetClient?clientId='+clients[i].clientId+'">'+clients[i].Name+'</a><br/>'+
					'<span class="kheader">Business Name:</span> '+(clients[i].BusinessName==undefined?"":clients[i].BusinessName)+'<br/>'+
					'<span class="kheader">Nature of Business:</span> '+(clients[i].NatureOfBusiness==undefined?"":clients[i].NatureOfBusiness)+'</div>'+
					'<div class="ClientCardContact"><span class="kheader">Contact Person:</span> '+(clients[i].ContactPerson==undefined?"":clients[i].ContactPerson)+'<br/>'+
					'<span class="kheader">Phone:</span> '+(clients[i].BusinessPhone==undefined?"":clients[i].BusinessPhone)+'<br/>'+
					'<span class="kheader">Fax:</span> '+(clients[i].Fax==undefined?"":clients[i].Fax)+'<br/>'+
					'<span class="kheader">Email:</span> '+(clients[i].Email==undefined?"":clients[i].Email)+'<br/></div>'+
					'<div class="ClientCardNumbers"><span class="kheader">Business No.:</span> '+(clients[i].BusinessNumber==undefined?"":clients[i].BusinessNumber)+'<br/>'+
					'<span class="kheader">WSIB No.:</span> '+(clients[i].WSIBNumber==undefined?"":clients[i].WSIBNumber)+'<br/>'+
					'<span class="kheader">EHT No.:</span> '+(clients[i].EHTNumber==undefined?"":clients[i].EHTNumber)+'<br/>'+
					'<span class="kheader">PASID:</span> '+(clients[i].PASID==undefined?"":clients[i].PASID)+'</div>'+
					'</div>');
				}
			},
			error:function(xhr,status,error){
				alert('Error:'+error);
			}
		});
	});
	$('#CreateBusinessClientButton').button().click(function(){
		$('#BusinessClientDialog').dialog("open");
	});
	$('#CreatePersonalClientButton').button().click(function(){
		$('#PersonalClientDialog').dialog("open");
	});
	// Load all clients
	$.ajax({
		url:"/AjaxGetRecentBusinessClients",
		type:"GET",
		dataType:"json",
		data:{
			FilterBusiness:true,
			FilterPersonal:true
		},
		success:function(data,status,xhr){
			var clients=data.data;
			var clientsContainer=$('#ClientsContainer');
			for(var i=0;i<clients.length;i++){
				clientsContainer.append('<div id="'+clients[i].clientId+'" class="BusinessClientCard">'+
					'<div class="ClientCardInfo"><span class="kheader" style="font-size:1.3em">Client No.: <a href="/GetClient?clientId='+clients[i].clientId+'">'+clients[i].ClientNumber+'</span></a><br/>'+
					'<span class="kheader">Legal Name:</span> <a href="/GetClient?clientId='+clients[i].clientId+'">'+clients[i].Name+'</a><br/>'+
					'<span class="kheader">Business Name:</span> '+(clients[i].BusinessName==undefined?"":clients[i].BusinessName)+'<br/>'+
					'<span class="kheader">Nature of Business:</span> '+(clients[i].NatureOfBusiness==undefined?"":clients[i].NatureOfBusiness)+'</div>'+
					'<div class="ClientCardContact"><span class="kheader">Contact Person:</span> '+(clients[i].ContactPerson==undefined?"":clients[i].ContactPerson)+'<br/>'+
					'<span class="kheader">Phone:</span> '+(clients[i].BusinessPhone==undefined?"":clients[i].BusinessPhone)+'<br/>'+
					'<span class="kheader">Fax:</span> '+(clients[i].Fax==undefined?"":clients[i].Fax)+'<br/>'+
					'<span class="kheader">Email:</span> '+(clients[i].Email==undefined?"":clients[i].Email)+'<br/></div>'+
					'<div class="ClientCardNumbers"><span class="kheader">Business No.:</span> '+(clients[i].BusinessNumber==undefined?"":clients[i].BusinessNumber)+'<br/>'+
					'<span class="kheader">WSIB No.:</span> '+(clients[i].WSIBNumber==undefined?"":clients[i].WSIBNumber)+'<br/>'+
					'<span class="kheader">EHT No.:</span> '+(clients[i].EHTNumber==undefined?"":clients[i].EHTNumber)+'<br/>'+
					'<span class="kheader">PASID:</span> '+(clients[i].PASID==undefined?"":clients[i].PASID)+'</div>'+
					'</div>');
				
			}
		},
		error:function(xhr,status,error){
			alert('Error:'+error);
		}
	});
});
</script>
</head>
<body>
<%@include file="/WEB-INF/clientnavigation.jsp" %>
<div class="ClientListContainer" style="margin-bottom:10px;margin-top:-20px;">
<h1>CLIENT LIST</h1>
<div class="ClientActionsContainer" style="float:left;width:100%;margin:0 0 10px 18px">
<button id="CreateBusinessClientButton">Create Business Client</button>
<%@include file="/WEB-INF/businessclientdialog.jsp" %>
<button id="CreatePersonalClientButton">Create Personal Client</button>
<%@include file="/WEB-INF/personalclientdialog.jsp" %>
</div>
<div id="ClientFiltersContainer" style="float:left;width:100%;margin-bottom:10px;margin-left:18px;">
Filters:
<input id="FilterBusiness" name="FilterBusiness" type="checkbox" checked="checked"/><label for="FilterBusiness">Business</label>
<input id="FilterPersonal" name="FilterPersonal" type="checkbox" checked="checked"/><label for="FilterPersonal">Personal</label>
</div>
<div id="ClientsContainer">
</div>
</div>
</body>
</html>